<template>
	<view class="container">
		<h3>请输入章节小说内容：</h3>
		<view class="">
			第几章：输入数字：<uni-easyinput type="number" class="uni-mt-5" trim="all" v-model="zhangjie.num"
						placeholder="章节"></uni-easyinput>
		</view>
		<view class="">
			小说标题：	<uni-easyinput  class="uni-mt-5" trim="all" v-model="zhangjie.title"
						placeholder="标题"></uni-easyinput>
		</view>
		<textarea v-model="content" class="editor" maxlength="9999"></textarea>
	<view class="tong">
		<button class="btn" @click="save">保存</button>
		<button class="btn" @click="add">载入图片</button>
	</view>
	<view v-for="(item,index) in contentarr" :key="index"> <template v-if="item.includes('http')"> {{item}} </template> </view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				 content: '', // 小说内容
				 contentarr:[],
				 zhangjie:{
					 novelname:'',
					 num:null,
					 zhangjienum:'',
					 title:'',
					 contentarr:[]
					 
				 }
			}
		},
		onLoad: function(options) {
				console.log(options);
				this.zhangjie.novelname = options.novelname
				 console.log('123\n456');
			},
			
		methods: {
			add(){
				var that = this;
				uni.chooseImage({
					count: 1, // 最多可选择的图片数量，默认为 9
					sizeType: ['original', 'compressed'], // 可以指定选择原图或压缩图，默认为 ['original', 'compressed']
					sourceType: ['album', 'camera'], // 可以指定选择图片的来源，默认为 ['album', 'camera']
					success: function(res) {
						// 选择图片成功
						let tempFilePaths = res.tempFilePaths; // 图片的临时文件路径数组
						console.log('选择的图片路径:', tempFilePaths);
						const name = res.tempFiles[0].name // 选择图片的名称.后缀名
						console.log(name);
						uniCloud.uploadFile({
							filePath: tempFilePaths[0],
							cloudPath: Date.now() + "-" + name, // 这样写上传的图片后缀名就是原本的后缀名（也就是我最终想实现的效果）
						}).then(res => {
							console.log(res.fileID)
							that.content = that.content + '\n' + res.fileID;
							uni.hideLoading()
							uni.showToast({
								title: '添加成功',
								icon: 'success'
							});
						})
					},
					fail: function(err) {
						// 选择图片失败
						console.error('选择图片失败:', err);
					}
				});
			},
			   save() {
			      // 将小说内容保存至后端
			      // 这里只是简单地将内容打印到控制台
			      console.log(this.content);
				  const arr = this.content.split('\n'); // 将字符串按换行符分割为数组
					this.contentarr = arr;
					console.log(arr);
				this.zhangjie.contentarr = arr;
				this.zhangjie.zhangjienum = '第'+this.zhangjie.num+'章'
				console.log(this.zhangjie);
				let obj = this.zhangjie
				uniCloud.callFunction({
					name:"write_novel",
					data:obj
				}).then(res=>{
					console.log(res);
				})
			    },
		}
	}
</script>

<style>
	
	view{
		margin-top: 10px;
	}
.container {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.editor {
	margin: 20px 0;
  width: 95%;
  height: 300px;
  padding: 10px;
  border: 1px solid #ccc;
  resize: none;
}

.tong{
	width: 100%;
	display: flex;
	justify-content: space-between;
}

.tong .btn {
  margin-top: 10px;
  padding: 5px 10px;
  background-color: #007bff;
  color: #fff;
  border: none;
}
</style>
